<template>
  <div class="l-wf-audit-timeline">
    <el-timeline>
    <el-timeline-item type="primary"  :timestamp="item.time" :key="item.id" v-for="item in list">
      <div class="l-wf-audit-timeline__title">{{ item.operationName }}</div>
      <div class="l-wf-audit-timeline__user">{{ item.name }}{{ item.user }}</div>
      <div class="l-wf-audit-timeline__user" v-if="item.des" >{{$t('相关说明:')}}{{ item.des }}</div>
    </el-timeline-item>
    </el-timeline>
  </div>
</template>
<script>
const apiWfProcess = window.$api.workflow.process;
export default {
  name: "l-wf-audit-timeline",
  props: {
    data: {
      type: Array,
      default: () => [],
    },
    processId: String,
    isLoadData: Boolean,
  },
  data() {
    return {
      list: [],
    };
  },
  computed: {
    showList() {
      if (this.isLoadData) {
        return this.list;
      } else {
        return this.data;
      }
    },
  },
  mounted() {
    if (this.isLoadData) {
      this.loadData();
    }
  },
  methods: {
    async loadData() {
      const logs = await this.$awaitWraper(
        apiWfProcess.getLogs(this.processId)
      );
      this.list = this.setLogsAndTasks(logs || []);
    },
    setLogsAndTasks(logs) {
      const userLogs = [];
      logs.forEach((log) => {
        if ((log.f_TaskType == 1 || log.f_TaskType == 0) && !["sign"].includes(log.f_OperationCode)) {
          // 右侧显示审核记录
          const userLogIndex = userLogs.findIndex((t) => t.id == log.f_UnitId);
          if (userLogIndex == -1) {
            if(log.f_TaskType == 0){
              log.f_UnitName = '';
            }
            else{
              log.f_UnitName += ':';
            }
            userLogs.push({
              id: log.f_UnitId,
              name: log.f_UnitName,
              user: log.f_UserName,
              time: this.lr_dateFormat(log.f_CreateDate),
              operationName:log.f_OperationName,
              des: log.f_Des.replace(`【${log.f_OperationName}】`,''),
              img: log.f_StampImg,
            });
          }
        }
      });
      return userLogs.sort(function (a, b) {
        return b.time < a.time ? 1 : -1;
      });
    },
  },
};
</script>

<style lang="scss">
.l-wf-audit-timeline{
  &__user{
    font-size: 14px;
    color:#999;
  }
}
</style>